<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>求职者注册</title>
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="<%=request.getContextPath() %>/static/common/plugin/bootstrap-3.3.5/css/bootstrap.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="<%=request.getContextPath() %>/static/common/plugin/jquery-1.11/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="<%=request.getContextPath() %>/static/common/plugin/bootstrap-3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
     <!-- 注册失败后的页面 -->
  <c:if test="${!empty param.registerError }">
     
   <div class="alert alert-warning alert-dismissible fade in" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
      <strong><h3><center><font color="red">注册失败，请重新注册!</font></center></h3></strong>
    </div>
</c:if>
     
     
     <div class="alert alert-info alert-dismissible fade in" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
      <strong><h3><center>求职者注册</center></h3></strong>
    </div>
     <hr>
    
     
<form action="<%=request.getContextPath() %>/TalentServlet?command=register" method="post" onsubmit="return validate()">

  <div class="form-group">
    <input type="text" class="form-control" autofocus="autofocus" id= "code" name="code" placeholder="账号...." value="${requestScope.talent.code }">
    <span id="codeInfo"></span>
  </div>
  <div class="form-group">
    <input type="password" class="form-control" name="password" id= "password" placeholder="密码" >
       <span id="passwordInfo"></span>
  </div>
  
    <div class="form-group">
    <input type="text" class="form-control" id= "name" name="name"placeholder="姓名...." value="${requestScope.talent.name}">
       <span id="nameInfo"></span>
  </div>
  <div class="form-group">
    <input type="text" class="form-control" id= "email" name="email" placeholder="邮箱..." value="${requestScope.talent.email}">
       <span id="emailInfo"></span>
  </div>
  
   <div class="form-group">
    <input type="text" class="form-control" id= "phone" name="phone" placeholder="手机...." value="${requestScope.talent.phone}">
       <span id="phoneInfo"></span>
  </div>
  <div class="form-group">
      <select class="form-control"  name="age" id= "age">
        <option value="">-请选择年龄-</option>
        <script>
         for(var i =16;i<30;i++){
        	 //如果要在js代码上写EL，这个js代码必须卸载jsp页面上，不可以使用外部引入!
        	 var age = '${requestScope.talent.age}';
        	  if( i == age){
        		  document.write('<option selected="selected">'+i+'</option>');
        	  }else{
        	      document.write('<option>'+i+'</option>');
        	  }
         }
        </script>
   
 </select>
 <span id="ageInfo"></span>
  </div>
  
  <div class="radio">性别:
  <c:if test="${requestScope.talent.gender == 1 || empty requestScope.talent}">
   <label>
      <input type="radio" name="gender" checked="checked" value="1"> 男
   </label>
   <label>
      <input type="radio" name="gender" value="2"> 女
    </label>
  </c:if>
  <c:if test="${requestScope.talent.gender == 2}"> 
   <label>
      <input type="radio" name="gender"  value="1"> 男
        </label>
        <label>
      <input type="radio" name="gender"  checked="checked" value="2"> 女
    </label>
 </c:if>
</div>
  
  <div class="checkbox">爱好:
    <label>
      <input type="checkbox" value="读书" name="hobby"> 读书
    </label>
     <label>
      <input type="checkbox" value="编程" name="hobby"> 编程
    </label>
     <label>
      <input type="checkbox" value="看电影" name="hobby"> 看电影
    </label>
     <label>
      <input type="checkbox" value="游泳" name="hobby"> 游泳
    </label>
  </div>
  <div class="form-group">
    <input   type="submit" class="btn btn-info" value="注册"></input>
     <input  type="button" class="btn btn-success" onclick="location='<%=request.getContextPath()%>/view/talent/login.jsp'" value="已有账号"></button>
  </div> 
</form>
<script>
	 /**
	  * 多选框的回显
	  */
   var hobby = '${requestScope.talent.hobby}';
   var hobbies = hobby.split("|");  //得到每个兴趣
    	//var allHobbies= document.getElementsByName("hobby");  //得到的是框框
    	
    	// for (var i = 0;  i< hobbies.length; i++) {
		//	  for (var j = 0; j< allHobbies.length; j++) {
	    //	    if (hobbies[i] == allHobbies[j].value) {
	    //	      allHobbies[j].checked = true;
	    //      }
	    //   }
		//  }	
    	
    	$(":checkbox").val(hobbies);
</script>

<script>
       /**
        *表单的验证
        */
        function validate(){
    	var flag = true;
        var codeDOM= document.getElementById("code");
        var passwordDOM= document.getElementById("password");
        var nameDOM= document.getElementById("name");
        var emailDOM= document.getElementById("email");
        var phoneDOM= document.getElementById("phone");
        var ageDOM = document.getElementById("age");
        
        if (codeDOM.value =='') {
			 document.getElementById("codeInfo").innerHTML='<font color="red"><b>账号不能为空哦</b></font>';
			 flag = false;
		}else{
			 document.getElementById("codeInfo").innerHTML='';
		}
        
        if (passwordDOM.value =='') {
			 document.getElementById("passwordInfo").innerHTML='<font color="red"><b>密码不能为空哦</b></font>';
			 flag = false;
		}else{
			 document.getElementById("passwordInfo").innerHTML='';
		}
        
        if (nameDOM.value =='') {
			 document.getElementById("nameInfo").innerHTML='<font color="red"><b>姓名必须填写</b></font>';
			 flag = false;
		}else{
			 document.getElementById("nameInfo").innerHTML='';
		}
        
        if (emailDOM.value =='') {
			 document.getElementById("emailInfo").innerHTML='<font color="red"><b>邮箱不能为空</b></font>';
			 flag = false;
		}else{
			 document.getElementById("emailInfo").innerHTML='';
		}
        
        if (phoneDOM.value =='') {
			 document.getElementById("phoneInfo").innerHTML='<font color="red"><b>买个手机去吧</b></font>';
			 flag = false;
		}else{
			 document.getElementById("phoneInfo").innerHTML='';
		}
        
        if (ageDOM.value =='') {
			 document.getElementById("ageInfo").innerHTML='<font color="red"><b>请选择年龄</b></font>';
			 flag = false;
		}else{
			 document.getElementById("ageInfo").innerHTML='';
		}
    	   return flag;
       }
   
   
</script>

</body>
</html>